<!-- 换车设置组件 -->
<template>
  <el-dialog 
    v-el-drag-dialog="{drag: true, full: false, resize: false}"
    title="换车设置" 
    :visible="true"
    :close-on-click-modal="false"
    @close="closeMd"
    width="420px"
  >
    <el-form 
      :model="fm.ps" 
      :ref="fm.fname" 
      :label-width="'80px'" 
      @keyup.enter.native="onSubmit"
    >
      <el-form-item
        label="运价设置"
        prop="transportPrice"
        :rules="[
          {required: true, message: '请输入运价金额'},
          {type: 'number', message: '运价金额格式错误'}
        ]"
      >
        <el-input 
          v-model.number="fm.ps.transportPrice" 
          placeholder="请输入运价金额"
          maxlength="6"
        ></el-input>
      </el-form-item>

      <el-form-item
        label="师傅现收"
        prop="remindRouteCash"
        :rules="[
          {required: true, message: '请输入师傅现收金额'},
          {type: 'number', message: '师傅现收金额格式错误'}
        ]"
      >
        <el-input 
          v-model.number="fm.ps.remindRouteCash" 
          placeholder="请输入师傅现收金额"
          maxlength="6"
        ></el-input>
      </el-form-item>

      <el-form-item
        label="其他费用"
        prop="otherFees"
        :rules="[
          {required: true, message: '请输入其他费用金额'},
          {type: 'number', message: '其他费用金额格式错误'}
        ]"
      >
        <el-input 
          v-model.number="fm.ps.otherFees" 
          placeholder="请输入其他费用金额"
          maxlength="6"
        ></el-input>
      </el-form-item>

      <el-form-item 
        label="途径高速"
        prop="wayHighSpeed" 
        :rules="[
          { required: false, message: '请输入途径高速', trigger: 'blur' }
        ]"
      >
        <el-input 
          v-model="fm.ps.wayHighSpeed" 
          placeholder="请输入途径高速，如：成资渝高速"
          maxlength="100"
          show-word-limit
        ></el-input>
      </el-form-item>

      <el-form-item 
        label="行程简称"
        prop="routeShort" 
        :rules="[
          { required: true, message: '请输入行程简称', trigger: 'blur' },
          { min: 1, max: 15, message: '长度在 1 到 15 个字符', trigger: 'blur' }
        ]"
      >
        <el-input 
          v-model="fm.ps.routeShort" 
          placeholder="行程简称"
          maxlength="15"
          show-word-limit
        ></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" :disabled="fm.sb.load" @click="onSubmit">{{fm.sb.text}}</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>

<script>
import elDragDialog from '@/directive/el-drag-dialog';

export default {
  name: 'ChangeCarSet',
  directives: { elDragDialog },
  props: [
    'dat'
  ],
  data() { 
    return {
      fm: {
        fname: 'changeCarSetFm',
        sb: { load: false, text: '保存' },
        ps: {...this.dat}
      }
    }
  },
  created(){
  },
  methods:{
    closeMd(ps){// 关闭弹框
      const that = this;

      let e = {state: false};
      if(ps){
        e.o = {...ps};
      }else{
        e.o = {...that.dat};
      }

      that.$emit('getMdState', e);
    },
    // 查询-数据
    onSubmit(){
      const that = this;

      that.$refs[that.fm.fname].validate((valid) => {
        if (!valid) {
          return false; 
        }else{
          that.closeMd({...that.fm.ps});
        }
      });
    }
    
  }
}
</script>

<style lang="less" scoped>
  
</style>